<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="/grsun" prefix="grsun"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta charset="utf-8" />
<meta name="description" content="Mailbox with some customizations as described in docs" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<%@ include file="/include/main_include.jsp"%>
<%@ include file="/include/form_include.jsp"%>
</head>
<body>
	<div class="modal-body" style="max-height: 716px;">
		<div id="divform" class="row mx-dialog-c bs_dialog open"> 
		   <form id="dataForm" class="form-horizontal" method="post"> 
		   <input type="hidden" id="agentId" name="agentId" value="${pd.agentId}"/>   
		    <div class="form-group col-lg-6 col-sm-6 col-xs-6">
		        <label class="control-label mx-group-title">父代理</label>
		        <div class="mx-group-control" style="height:33px;">
		        	<span class="input-icon input-icon-right reftext mx-input-group width-100">
		        			<c:if test="${role.roleCode.equals('agent') }">
								<input type="text" class="form-control reftext-text" value="自己" id="" NAME="parentName" readonly="readonly">
								<i class="ace-icon fa fa-search  bigger-120 reftext-search-button" id=""></i>
								<input type="hidden" name="parentId" id="parentId" value="${user.agentId }" />
		        			</c:if>
		        			<c:if test="${role.roleCode.equals('admin') }">
								<input type="text" class="form-control reftext-text" value="${pd.parentName  }" id="parentName" NAME="parentName" readonly="readonly">
								<i class="ace-icon fa fa-search  bigger-120 reftext-search-button" id="parentNameChoose"></i>
								<input type="hidden" name="parentId" id="parentId" value="${pd.parentId }" />
		        			</c:if>
							
						</span>
		        </div>
		    </div>
			<div class="form-group col-lg-6 col-sm-6 col-xs-6">
		        <label class="control-label mx-group-title">城市</label>
		        <div class="mx-group-control" style="height:33px;">
		        		<span class="input-icon input-icon-right reftext mx-input-group width-100">
							<input type="text" class="form-control reftext-text" value="${empty pd.county?(empty pd.city?pd.province:pd.city):pd.county  }" id="agentCounty" NAME="agentCounty" readonly="readonly">
							<i class="ace-icon fa fa-search  bigger-120 reftext-search-button" id="agentChoose"></i>
							<input type="hidden" name="cityparentid" id="cityparentid" value="${pd.countyId }" />
						</span>
		        </div>
		    </div>
		    <div class="form-group col-lg-6 col-sm-6 col-xs-6">
		        <label class="control-label mx-group-title">代理商名称</label>
		        <div class="mx-group-control" style="height:33px;">
					<input id="name" name="name" type="text" class="width-100 mx-input-group" style="height:33px;" value="${pd.name}">
		        </div>
		    </div>
			<div class="form-group col-lg-6 col-sm-6 col-xs-6">
		        <label class="control-label mx-group-title">代理费</label>
		        <div class="mx-group-control" style="height:33px;">
					<input id="agentFee" name="agentFee" type="number" class="width-100 mx-input-group" style="height:33px;" value="${pd.agentFee}">
		        </div>
		    </div>
			<div class="form-group col-lg-6 col-sm-6 col-xs-6">
		        <label class="control-label mx-group-title">电话</label>
		        <div class="mx-group-control" style="height:33px;">
					<input id="mobile" name="mobile" type="text" class="width-100 mx-input-group" style="height:33px;" value="${pd.mobile}">
		        </div>
		    </div>
			<div class="form-group col-lg-6 col-sm-6 col-xs-6">
		        <label class="control-label mx-group-title">地址</label>
		        <div class="mx-group-control" style="height:33px;">
					<input id="address" name="address" type="text" class="width-100 mx-input-group" style="height:33px;" value="${pd.address}">
		        </div>
		    </div>
			<div class="form-group col-lg-6 col-sm-6 col-xs-6">
					<label class="control-label mx-group-title width-10"><span class="require" style='color:red;font-size:16px'>*</span>开户行省</label>
					<div class="mx-group-control" style="height: 33px;">
						<input id="bank_province" name="bank_province" type="text" class="width-65 mx-input-group" style="height: 33px;" value="${pd.bankProvince}">
						<input id="bank_province_id" name="bank_province_id" type="hidden" class="width-65 mx-input-group" style="height: 33px;" value="${pd.bankProvinceId}">
					</div>
				</div>
				<div class="form-group col-lg-6 col-sm-6 col-xs-6">
					<label class="control-label mx-group-title width-10"><span class="require" style='color:red;font-size:16px'>*</span>开户行市</label>
					<div class="mx-group-control" style="height: 33px;">
						<input id="bank_city" name="bank_city" type="text" class=" width-65 mx-input-group" style="height: 33px;" value="${pd.bankCity}" >
						<input id="bank_city_id" name="bank_city_id" type="hidden" class=" width-65 mx-input-group" style="height: 33px;" value="${pd.bankCityId}" >
					</div>
				</div>
		    <div class="form-group col-lg-6 col-sm-6 col-xs-6">
					<label class="control-label mx-group-title width-10"><span class="require" style='color:red;font-size:16px'>*</span>开户总行</label>
					<div class="mx-group-control" style="height: 33px;">
						<input id="bank_name" name="bank" type="text" class=" width-65 mx-input-group" style="height: 33px;" value="${pd.bank}"  value="${pd.bank}" >
						<input id="bank_parent_id" name="bank_parent_id" type="hidden" class=" width-65 mx-input-group" style="height: 33px;"    value="${pd.bankId}">
					</div>
				</div>
				<div class="form-group col-lg-6 col-sm-6 col-xs-6">
					<label class="control-label mx-group-title width-10"><span class="require" style='color:red;font-size:16px'>*</span>开户支行</label>
					<div class="mx-group-control" style="height: 33px;">
						<input id="bank_branch_name" name="bankBranchId" type="text" class=" width-65 mx-input-group" style="height: 33px;" value="${pd.bankBranch}" >
					</div>
				</div>
		    
			<div class="form-group col-lg-6 col-sm-6 col-xs-6">
		        <label class="control-label mx-group-title">银行卡号</label>
		        <div class="mx-group-control" style="height:33px;">
					<input id="bankCard" name="bankCard" type="text" class="width-100 mx-input-group" style="height:33px;" value="${pd.bankCard}">
		        </div>
		    </div>
			<div class="form-group col-lg-6 col-sm-6 col-xs-6">
		        <label class="control-label mx-group-title">开户人</label>
		        <div class="mx-group-control" style="height:33px;">
					<input id="bankName" name="bankName" type="text" class="width-100 mx-input-group" style="height:33px;" value="${pd.bankName}">
		        </div>
		    </div>
		    
		    <div class="form-group col-lg-6 col-sm-6 col-xs-6">
		        <label class="control-label mx-group-title">税务登记证明</label>
		        <div class="mx-group-control" style="height:100px;">
				        <div class="layui-upload">
				        <input type="hidden"  name="taxProve"  id="hide1"  value="${pd.taxProve}">
						 <input class="layui-upload-file" type="file" accept="images" name="file">
						  <div class="layui-upload-list">
						    <img class="layui-upload-img" id="test1" src="${imagePath}${pd.taxProve}">
						    <p id="demoText1"></p>
						  </div>
						</div> 
		        </div>
		    </div>
			<div class="form-group col-lg-6 col-sm-6 col-xs-6">
		        <label class="control-label mx-group-title">工商登记证明</label>
		         <div class="mx-group-control" style="height:100px;">
				        <div class="layui-upload">
						 <input class="layui-upload-file" type="file" accept="images" name="file">
						 <input type="hidden"  name="businessProve"  id="hide2"  value="${pd.businessProve}">
						  <div class="layui-upload-list">
						    <img class="layui-upload-img" id="test2" src="${imagePath}${pd.businessProve}">
						    <p id="demoText2"></p>
						  </div>
						</div> 
		        </div>
		    </div>
			<div class="form-group col-lg-6 col-sm-6 col-xs-6">
		        <label class="control-label mx-group-title">身份证正面</label>
		        <div class="mx-group-control" style="height:100px;">
				        <div class="layui-upload">
						 <input class="layui-upload-file" type="file" accept="images" name="file">
						 <input type="hidden"  name="card"   id="hide3" value="${pd.card}">
						  <div class="layui-upload-list">
						    <img class="layui-upload-img" id="test3" src="${imagePath}${pd.businessProve}" >
						    <p id="demoText3"></p>
						  </div>
						</div> 
		        </div>
		    </div>
			<div class="form-group col-lg-6 col-sm-6 col-xs-6">
		        <label class="control-label mx-group-title">身份证反面</label>
		         <div class="mx-group-control" style="height:100px;">
				        <div class="layui-upload">
						 <input class="layui-upload-file" type="file" accept="images" name="file">
						 <input type="hidden"  name="cardBack"  id="hide4"  value="${pd.cardBack}">
						  <div class="layui-upload-list">
						    <img class="layui-upload-img" id="test4" src="${imagePath}${pd.cardBack}">
						    <p id="demoText4"></p>
						  </div>
						</div> 
		        </div>
		    </div>
		  </form>                  
		</div>
	</div>
	
	<div id="branchSearchBtn"  >
		<form class="form-inline">
			<input type="text" class="input-md" id="branch_name" placeholder="支行名称">
			<button type="button" class="btn btn-info btn-sm" id="sbranchSearchBtn">
				<i class="ace-icon fa fa-search bigger-110"></i>
				查询
			</button>
		</form>
	</div>
<div id="bankSearchBtn">
		<form class="form-inline">
			<input type="text" class="input-md" id="SE_bank_name" placeholder="名称">
			<button type="button" class="btn btn-info btn-sm" id="sbankSearchBtn">
				<i class="ace-icon fa fa-search bigger-110"></i>
				查询
			</button>
		</form>
	</div>
	<script type="text/javascript">

	 function uploadFile(upload,flag){
		 upload.render({
			    elem: '#test'+flag
			    ,size:10000
			    ,url: '${path}/image/upload.do?path=agent'
		    	,before: function(obj){
		    	      //预读本地文件示例，不支持ie8
		    	      obj.preview(function(index, file, result){
		    	        $('#test'+flag).attr('src', result); //图片链接（base64）
		    	      });
		    	 }
	    	    ,done: function(res){
	    	      //如果上传失败
	    	      if(res.code > 0){
	    	        return layer.msg('上传失败');
	    	      }else{
		    	      //上传成功
					$("#hide"+flag).val(res.url);	    	 
					return layer.msg('上传成功');
	    	      }
	    	    }
		 	});
	 }
		
		
	$(function() {
		layui.use('upload', function(){
			  var $ = layui.jquery;
			  upload = layui.upload;
			  uploadFile(upload,1);
			  uploadFile(upload,2);
			  uploadFile(upload,3);
			  uploadFile(upload,4);
		  });
		
	
		
		$('#parentNameChoose,#parentName').on('click', function() {
			grsunChooseWindow.chooseAgentWindow.show(function(result) {
				$('#parentId').val(result.id);
				$('#parentName').val(result.text);
			});
		});
		$('#agentCounty,#agentChoose').on('click', function() {
			grsunChooseWindow.chooseCityWindow.show(function(result) {
				$('#cityparentid').val(result.itemid);
				$('#agentCounty').val(result.text);
			});
		});
		
		$('#dataForm').validate({
			submitHandler : function(form) {
				var index = parent.layer.getFrameIndex(window.name);
				$.uitools.showLoading();//打开处理中遮罩层
				$.ajax({
					cache : true,
					type : "POST",
					url : rootpath + '/hhAgent/save.do',
					data : $('#dataForm').serialize(),
					error : function(request) {
						$.uitools.hideLoading();//关闭处理中遮罩层
						layer.msg('系统异常！', {
							icon : 2,
							time : 1000
						}, function() {
							parent.layer.close(index);
						})
					},
					success : function(data) {
						$.uitools.hideLoading();//关闭处理中遮罩层
						if (data.code==0) {
							layer.msg('提交成功！', {
								icon : 1,
								time : 1000
							}, function() {
								parent.layer.close(index);
								//刷新列表
								parent.dataTable.datagrid('reload');
							})
						} else {
							layer.msg('提交异常！', {
								icon : 2,
								time : 1000
							}, function() {
								parent.layer.close(index);
							})
						}
					}
				});
			},
			rules : {
				agentId : { required : true },
				name : { required : true },
				parentId : { required : true },
				province : { required : true },
				city : { required : true },
				county : { required : true },
				countyId : { required : true },
				agentFee : { required : true },
				balance : { required : true },
				mobile : { required : true },
				address : { required : true },
				addTime : { required : true ,number : true},
				type : { required : true ,number : true},
				status : { required : true ,number : true},
				taxProve : { required : true },
				businessProve : { required : true },
				card : { required : true },
				cardBack : { required : true },
				bankCard : { required : true },
				bankName : { required : true },
				bank : { required : true },
				bankBranch : { required : true }
			},
			messages : {
				agentId : { required : '请输入' },
				name : { required : '请输入代理商名称' },
				parentId : { required : '请输入父级id' },
				province : { required : '请输入省' },
				city : { required : '请输入市' },
				county : { required : '请输入县' },
				countyId : { required : '请输入id' },
				agentFee : { required : '请输入代理费' },
				balance : { required : '请输入余额' },
				mobile : { required : '请输入电话' },
				address : { required : '请输入地址' },
				addTime : { required : '请输入添加时间' },
				type : { required : '请输入类型' },
				status : { required : '请输入状态' },
				taxProve : { required : '请输入税务登记证明' },
				businessProve : { required : '请输入工商登记证明' },
				card : { required : '请输入身份证正面' },
				cardBack : { required : '请输入身份证反面' },
				bankCard : { required : '请输入银行卡号' },
				bankName : { required : '请输入开户人' },
				bank : { required : '请输入开户行' },
				bankBranch : { required : '请输入开户支行' }
			},
			// 失去焦点时不执行验证
			onfocusout : false,
			// 错误提示，错误对象
			errorPlacement : function(error, element) {
				// 1.错误信息，2提示位置，3同时提示多个错误
				layer.tips(error[0].innerText, element, {
					// 错误信息可以同时提示多个，...
					tipsMore : true,
					tips : [ 3, '#D16E6C' ]
				});
			}
		});
		
		//------------开户省份，开户城市，开户行，支行------------
		$('#bank_province').combogrid({
			pageSize : BasicData.pageSize,
			pageList : BasicData.pageList,
			// 设置为 true，则在数据网格（datagrid）底部显示分页工具栏。
			pagination : false,
			// 设置为 true，则会自动扩大或缩小列的尺寸以适应网格的宽度并且防止水平滚动。
			fitColumns : true,
			panelWidth : 650,
			panelHeight : 300,
			mode : 'remote',
			url : rootpath + '/hhCity/cityList.do?id=0',
			idField : 'id',
			textField : 'text',
			toolbar : '#bankToolbar',
			onClickRow:function(index,data){
				$("#bank_province_id").val(data.id);
				$("input[name=bank_province]").val(data.text);
				$("input[name=bank_city_id]").val("");

				$('#bank_branch_name').combogrid('setValue', '');
				$('#bank_city').combogrid('setValue', '');
			},
			columns : [ [ {
				field : 'text',
				title : '名称',
				width : 120
			},  {
				field : 'id',
				hidden : true
			} ] ]
		});
		
		$('#bank_city').combogrid({
			pageSize : BasicData.pageSize,
			pageList : BasicData.pageList,
			// 设置为 true，则在数据网格（datagrid）底部显示分页工具栏。
			pagination : false,
			// 设置为 true，则会自动扩大或缩小列的尺寸以适应网格的宽度并且防止水平滚动。
			fitColumns : true,
			panelWidth : 650,
			panelHeight : 300,
			onShowPanel:function(){
				var parentId=$("#bank_province_id").val();
				if(parentId!=''){
					var bankProvince=$("input[name=bank_province]").val();
						$('#bank_city').combogrid("grid").datagrid({
							url : rootpath +'/hhCity/cityList.do?id=' + parentId
						});
				}
			},
			idField : 'id',
			onClickRow:function(index,data){
				$("#bank_city_id").val(data.id);
				$("input[name=bank_city]").val(data.name);
			},
			textField : 'text',
			toolbar : '#bankToolbar',
			columns : [ [ {
				field : 'text',
				title : '名称',
				width : 120
			}, {
				field : 'id',
				hidden : true
			} ] ]
		});
		$('#bank_name').combogrid({
			pageSize : BasicData.pageSize,
			pageList : BasicData.pageList,
			// 设置为 true，则在数据网格（datagrid）底部显示分页工具栏。
			pagination : true,
			// 设置为 true，则会自动扩大或缩小列的尺寸以适应网格的宽度并且防止水平滚动。
			fitColumns : true,
			panelWidth : 650,
			panelHeight : 300,
			mode : 'remote',
			url : rootpath + '/hhBank/list.do',
			onClickRow:function(index,data){
				$("#bank_parent_id").val(data.bankId);
				$("input[name=bank_name]").val(data.name);
				$('#bank_branch_name').combogrid('setValue', '');
			},
			idField : 'name',
			textField : 'name',
			toolbar : '#bankSearchBtn',
			columns : [ [ {field : 'name',title : '名称',width : 120}, 
				{field : 'bank_code',title : '编码',width : 400}, 
				{field : 'bankId',hidden : true} ] ]
		});
		
		
		$('#bank_branch_name').combogrid({
			pageSize : BasicData.pageSize,
			pageList : BasicData.pageList,
			// 设置为 true，则在数据网格（datagrid）底部显示分页工具栏。
			pagination : true,
			// 设置为 true，则会自动扩大或缩小列的尺寸以适应网格的宽度并且防止水平滚动。
			fitColumns : true,
			panelWidth : 650,
			panelHeight : 300,
			toolbar : '#branchSearchBtn',
			idField : 'bankBranchId',
			onShowPanel:function(){
				var provinceId=$("#bank_province_id").val();
				var cityId=$("#bank_city_id").val();
				var bankId=$("#bank_parent_id").val();
				$('#bank_branch_name').combogrid("grid").datagrid({
					url : rootpath + '/hhBankBranch/list.do?parentId=' + bankId+"&provinceId="+provinceId+"&cityId="+cityId
				});
			},
			textField : 'branchName',
			columns : [ [ {field : 'branchName',title : '名称',width : 120},
				{field : 'bankBranchId',hidden : true} ] ]
		});
		
		$('#sbranchSearchBtn').on('click', function() {
			$('#bank_branch_name').combogrid("grid").datagrid("reload", {
				branchName : $('#branch_name').val()
			});
		});
		$('#sbankSearchBtn').on('click', function() {
			$('#bank_name').combogrid("grid").datagrid("reload", {
				name : $('#SE_bank_name').val()
			});
		});
		 //------------开户省份，开户城市，开户行，支行----------
	});
	</script>
</body>
</html>
